import React from 'react';
import { connect } from 'dva/index';
import { Table, Row, Col, Form, Input, Icon, InputNumber, Radio, DatePicker, Select, Upload, Button, Switch, Modal, Popconfirm, Tabs, message, Steps } from 'antd';
import OperatorConstant from "../../utils/OperatorConstant";
import Constants from '../../utils/Constants';
import BizParams from '../../components/commons/BizParams'
import { downloadFile, download } from '../../utils/commons';
const { TextArea } = Input;
const Step = Steps.Step;
const Dragger = Upload.Dragger;
const R = require('ramda');
import moment from 'moment'
const TabPane = Tabs.TabPane;
const FormItem = Form.Item;

const taxStatus = Form.create({ wrappedComponentRef: true })(class TaxStatus extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            open: false
        }
    }

    handleOpen = () => {
        this.setState({ open: true })
    }

    handleCancel = () => {
        this.props.form.resetFields();
        this.setState({ open: false })
        this.props.dispatch({
            type: 'tax/refreshState',
            payload: {
                dataSource: {}
            }
        });
    }

    updateOrder = () => {
        let transferaccountstatus = this.props.form.getFieldValue('transferaccountstatus');
        if (!transferaccountstatus) { message.info("退税状态不能为空！"); return; }
        let presenttime = this.props.form.getFieldValue('presenttime');
        if (!presenttime) { message.info("交单时间不能为空！"); return; }
        let dataSource = this.props.tax.dataSource ? this.props.tax.dataSource : {};
        let order = dataSource.order ? dataSource.order : {};
        presenttime = presenttime.format(Constants.DATEFORMAT);
        this.props.dispatch({
            type: 'tax/updateOrder',
            payload: {
                id: order.id,
                presenttime,
                transferaccountstatus,
                onSuccess: () => {
                    this.handleCancel();
                    if (this.props.refreshList) this.props.refreshList();
                }
            }
        });
    }

    render() {
        const { getFieldDecorator } = this.props.form;
        const formItemLayout = { labelCol: { span: 8 }, wrapperCol: { span: 14 } };
        let dataSource = this.props.tax.dataSource ? this.props.tax.dataSource : {};
        let order = dataSource.order ? dataSource.order : {};
        let tgApproval = dataSource.tgApproval ? dataSource.tgApproval : {};
        return (
            <Modal visible={this.state.open} title={"退税状态"} confirmLoading={this.props.loading} width={600} onCancel={this.handleCancel} onOk={this.updateOrder}>

                <Form>
                    <Row>
                        <Col span={15}>
                            <FormItem
                                {...formItemLayout}
                                label="退税款到账状态"
                                hasFeedback
                            >
                                {getFieldDecorator('transferaccountstatus', {
                                    rules: [{
                                        required: true, message: '请选择退税款到账状态！',
                                    }],
                                    initialValue: order.transferaccountstatus
                                })(
                                    <Select disabled={order.transferaccountstatus == 1 || !order.presenttime} allowClear>
                                        <Select.Option value="0">待退税</Select.Option>
                                        <Select.Option value="1">退税款到账</Select.Option>
                                        <Select.Option value="2">暂缓退税</Select.Option>
                                        <Select.Option value="3">税局发函</Select.Option>
                                    </Select>
                                    )}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={15}>
                            <FormItem
                                {...formItemLayout}
                                label="交单时间"
                                hasFeedback
                            >
                                {getFieldDecorator('presenttime', {
                                    rules: [{
                                        required: true, message: '请输入交单时间',
                                    }],
                                    initialValue: order.presenttime ? moment(order.presenttime, Constants.DATEFORMAT) : undefined
                                })(
                                    <DatePicker
                                        showTime={{ format: 'YYYY-MM-DD' }}
                                        format="YYYY-MM-DD"
                                        placeholder="请选择时间"
                                        disabled={!!order.presenttime} />
                                    )}
                            </FormItem>
                        </Col>

                    </Row>

                    <Tabs  >
                        <TabPane tab="报税四单备案" key="1">
                            <FormItem {...formItemLayout} label="下载报关单复印件" hasFeedback>
                                <a href="#" onClick={() => downloadFile(Constants.FILE_MODULE[0], tgApproval.url)}> {tgApproval.url ? tgApproval.url.substring(tgApproval.url.lastIndexOf('/') + 1, tgApproval.url.length) : "无"}</a>

                            </FormItem>
                            <FormItem{...formItemLayout} label="装货单" hasFeedback>
                                <a href="#" onClick={() => downloadFile(Constants.FILE_MODULE[0], order.inputboxpage)}> {order.inputboxpage ? order.inputboxpage.substring(order.inputboxpage.lastIndexOf('/') + 1, order.inputboxpage.length) : "无"}</a>
                            </FormItem>
                            <FormItem {...formItemLayout} label="提单复印件" hasFeedback>
                                <a href="#" onClick={() => downloadFile(Constants.FILE_MODULE[0], order.sendreceiptpage)}> {order.sendreceiptpage ? order.sendreceiptpage.substring(order.sendreceiptpage.lastIndexOf('/') + 1, order.sendreceiptpage.length) : "无"}</a>
                            </FormItem>
                        </TabPane>
                    </Tabs>

                </Form>
            </Modal>
        );
    }
})

function mapStateToProps(state) {
    return {
        loading: state.loading.models.tax, tax: state.tax
    };
}

export default connect(mapStateToProps)(taxStatus);
